<!-- 可带连接的图片 -->
<template>
  <div class="imgBox">
    <a :href="url" v-if="url" :target="target">
      <img :src="src" alt="" class="img" />
    </a>
    <img :src="src" alt="" class="img" v-else/>
  </div>
</template>

<script>
export default {
    props: {
    /**
     * @src 图片路径
     * @url 图片点击跳转链接
     * @target 点击链接是否新窗口打开，默认为新窗口
    */
    url: {
      type: String,
    },
    src: {
      type: String,
      required: true,
    },
    target: {
      type: String,
      default: "_blank",
    },
  },
  data() {
    return {};
  },
  computed: {},
  mounted() {},
  methods: {},
};
</script>

<style lang="scss" scoped>
.imgBox{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    .img{
      max-width: 80%;
      max-height: 80%;
    }
}
</style>
